//
// Tab overrides
//
/*
.gedit-bottom-panel-paned notebook,
terminal-window notebook {
  > header.top > tabs > tab:checked { box-shadow: inset 0 -1px $borders_color; }
}
*/

//
// GNOME Terminal, MATE Terminal
//

.mate-terminal {
  notebook {
    > header.top {
      > tabs > tab {
        border-top: 1px solid transparent;
      }
    }
  }
}

terminal-window {
  &.background.csd {
    border-radius: 0 0 0 0;
  }

  decoration {
    border-radius: $wm_radius $wm_radius 0 0;
  }

  notebook {
    button.flat.toggle.popup {
      min-height: 24px;
      min-width: 24px;
      margin: -2px;
    }
  }

  &.background.csd.maximized { border-radius: 0 0 0 0; } // Fixed gnome 3.32 issue: Unable to restore window size after maximization
}

window.background.csd { // gnome-terminal 3.32 setting
  > box.vertical > box.horizontal > frame {
    > border {
      border-width: 0 1px 0 0;
    }

    > scrolledwindow > viewport.frame {
      list {
        border-bottom-left-radius: $wm_radius;
      }
    }
  }

  > box.vertical > box.horizontal > stack {
    > widget > notebook.frame {
      border-width: 0;

      > stack {
        border-bottom-right-radius: $wm_radius;
      }
    }
  }
}

//
// Nautilus
//

%pathbar_box_button {
  // min-height: if($variant == 'light', 24px, 26px);
  border-radius: 0;
  border: 1px solid rgba(black, 0.2);
  border-right-style: none;
  border-bottom-color: $borders_bottom_color;
  background-color: $header_button_bg;
  background-image: $header_button_image;

  &:hover {
    color: darken($header_fg, 2%);
    background-color: $header_button_hover_bg;
    background-image: $header_button_hover_image;
  }

  &:active {
    color: $selected_fg_color;
    background-color: $header_button_active_bg;
    background-image: none;
  }

  &:checked {
    color: if($variant=='light', $selected_fg_color, $bg_color);
    background-color: $header_button_checked_bg;
    background-image: $header_button_checked_image;
    border-radius: 0 $bt_radius $bt_radius 0;
    border-right-style: solid;
  }

  &:checked:hover {
    color: if($variant=='light', $selected_fg_color, $base_color);
  }

  &:disabled { color: rgba($header_fg, 0.45); }

  &:backdrop { opacity: 0.65; background-image: none; }
}

.nautilus-window headerbar {

  .linked.raised:not(.path-bar) > button.image-button {
    @extend %outline_dashed;

    &, &:hover, &:active, &:checked, &:disabled {
      border-radius: $bt_radius;
      margin-right: if($variant=='light', 0, 1px);
      border-right: none;

      @if $variant == 'light' { border: 1px solid $borders_color; }
    }
  }

  .path-bar-box {
    color: transparent;
    background: none;

    .path-bar {
      padding: 0;
      margin: 0;

      button.flat.text-button.toggle,
      button.flat.image-button.text-button.toggle {
        padding-top: 0;
        padding-bottom: 0;
        margin: 0 0 0 -5px;
        @extend %pathbar_box_button;

        @if $variant == 'light' {
          &:active { box-shadow: 1px 0 darken($header_button_active_bg, 12%); }
        }

        @if $variant == 'dark' {
          border: none;
          margin: 0 0 0 -4px;
          box-shadow: inset 0 1px $header_button_highlight;

          &:hover {
            box-shadow: inset 0 1px $header_button_hover_highlight;
          }

          &:checked {
            box-shadow: inset 0 1px $header_button_checked_highlight;
          }
        }
      }

      @if $variant == 'dark' {
        button.flat.text-button.toggle {
          box-shadow: inset 0 1px $header_button_highlight, -1px 0 $borders_color;

          &:hover {
            box-shadow: inset 0 1px $header_button_hover_highlight, -1px 0 $borders_color;
          }

          &:active {
            box-shadow: -1px 0 $borders_color;
          }

          &:checked {
            box-shadow: inset 0 1px $header_button_checked_highlight, -1px 0 $borders_color;
          }
        }
      }

      button.flat.image-button.text-button.toggle {
        border-radius: $bt_radius 0 0 $bt_radius;

        &:checked {
          border-radius: $bt_radius $bt_radius $bt_radius $bt_radius;
        }
      }
    }

    .linked.nautilus-path-bar { // for ≥ 3.31.90
      button.text-button,
      button.image-button.text-button {
        margin-top: 0;
        margin-bottom: 0;
        min-height: if($variant == 'light', 24px, 26px);

        &:not(:only-child):last-child {
          @include button(header-checked);
          background-clip: if($variant=='light', border-box, padding-box);
          transition: $button_transition;
          transition-duration: 300ms;
          &:hover { background-image: none; }

          @if $variant == 'light' {
            box-shadow: -1px 0 mix(black, $header_button_checked_bg, 10%);
          }
        }
      }
    }

    // &.width-maximized {
    //   border: 1px solid if($titlebar == 'light', rgba(black, 0.12), rgba(white, 0.12));
    //   background-color: rgba($header_fg, 0.06);
    // }

    // workaround for 3.30.1
    &.background.frame {
      border: none;
      background-color: transparent;
    }
  }
}

.nautilus-canvas-item { border-radius: 2px; }

// .view.nautilus-desktop,
%nautilus-desktop-canvas-item,
.nautilus-desktop.nautilus-canvas-item {
  color: white;
  text-shadow: 1px 1px transparentize(black, 0.4);

  &:active {
    color: white;
  }

  &:selected {
    color: $selected_fg_color;
    text-shadow: none;
  }
}

.nautilus-canvas-item.dim-label,
.nautilus-list-dim-label {
  color: mix($fg_color, $bg_color, 50%);

  &:selected,
  &:selected:focus {
    color: mix($selected_fg_color, $selected_bg_color, 80%);
  }
}

$nautilus_radius: $wm_radius + 2px;

.nautilus-window {
  border-radius: $wm_radius $wm_radius $nautilus_radius $nautilus_radius;

  &, &.background.csd { background-color: transparent; }

  // Workaround for https://bugzilla.gnome.org/show_bug.cgi?id=724096
  searchbar { border-top: 1px solid $borders_color; }
  .searchbar-container { margin-top: -1px; }

  notebook {
    margin-left: -1px;
    margin-right: -1px;
    background-color: $base_color;

    tab { margin-left: -1px; }

    scrolledwindow {
      .view:not(:hover):not(:active):not(:selected) {
        background-color: transparent;
        // @extend %view;
      }
    }

    &, > stack {
      border-radius: 0 0 $nautilus_radius $nautilus_radius;
    }

    > stack:not(:only-child) {
      searchbar { background-color: $base_color; }
    }
  }

  // Floating Bar
  .floating-bar {
    padding: 1px;
    background-color: $selected_bg_color;
    color: $selected_fg_color;
    border-radius: 3px 0 $wm_radius 0;

    &.bottom.left {
      border-top-left-radius: 0;
    }

    &.bottom.right {
      border-top-right-radius: 0;
    }

    button {
      border: none;
      border-radius: 100px;
      min-height: 0;
      min-width: 0;
      padding: 0;
      margin-right: 6px;
      -gtk-icon-shadow: none;
      @extend %selected-button;
    }
  }

  // Reset maximized nautilus-window border-radius
  &.maximized {
    notebook {
      &, > stack {
        border-radius: 0 0 0 0;
      }
    }

    .floating-bar { border-radius: 3px 0 0 0; }
  }
}

.nautilus-list-view {
  background-color: $base_color;
  border-radius: 0 0 $wm_radius $wm_radius;

  treeview.view:not(:hover):not(:active):not(:selected) {
    background-color: transparent;
    border-radius: 0;
    // @extend %view;
  }
}

button.nautilus-circular-button.image-button {
  @extend %circular_button;
}

$disk_space_unknown: transparentize($fg_color, 0.5);
$disk_space_used: transparentize($selected_bg_color, 0.2);
$disk_space_free: darken($bg_color, 3%);

.disk-space-display {
  border-style: solid;
  border-width: 1px;

  &.unknown {
    background-color: $disk_space_unknown;
    border-color: darken($disk_space_unknown, 10%);
  }

  &.used {
    background-color: $disk_space_used;
    border-color: darken($disk_space_used, 10%);
  }

  &.free {
    background-color: $disk_space_free;
    border-color: darken($disk_space_free, 10%);
  }
}

@keyframes needs_attention_keyframes {
  0% {
    @include button(header-hover);
  }

  100% {
    @include button(header-active)
  }
}

.nautilus-operations-button-needs-attention {
  animation: needs_attention_keyframes 2s ease-in-out;
}

.nautilus-operations-button-needs-attention-multiple {
  animation: needs_attention_keyframes 3s ease-in-out;
  animation-iteration-count: 3;
}

// Batch renaming dialog
.conflict-row.activatable {
  &, &:active {
    color: $light_fg_color;
    background-color: $error_color;
  }

  &:hover {
    background-color: lighten($error_color, 10%);
  }

  &:selected {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
  }
}

//
// Nemo
//
.nemo-desktop.nemo-canvas-item {
  @extend %nautilus-desktop-canvas-item;
}

.nemo-window {
  .nemo-places-sidebar {
    &.frame { border-width: 0; }

    .places-treeview {
      -NemoPlacesTreeView-disk-full-bg-color: $dark_solid_borders_color;
      -NemoPlacesTreeView-disk-full-fg-color: lighten($progress_color, 5%);
    }
  }

  .sidebar {
    color: $dark_sidebar_fg;
    background-color: $dark_sidebar_bg;

    scrolledwindow.frame { border: none; } // Removed treeview double borders

    .view, row {
      background-color: transparent;
      color: $dark_sidebar_fg;
      @extend %row_activatable;

      &.cell:selected {
        color: $fg_color;
        background-color: $sidebar_theme_color;
      }

      &.expander {
        color: mix($dark_sidebar_fg, $dark_sidebar_bg, 50%);

        &:hover { color: $dark_sidebar_fg; }
      }
    }
  }

  paned > separator { background-image: image($solid_borders_color); }

  notebook {
    background-color: $base_color;
  }

  // Rename entry
  .nemo-window-pane widget.entry {
    border: 2px solid if($variant =='light', $entry_highlight, $selected_bg_color);
    background-color: $entry_bg;
    background-image: $header_button_image;
    border-radius: $bt_radius;
    box-shadow: none;

    &:selected {
      @extend %selected_items;

      &:focus { @extend %selected_items; }
    }
  }

  .toolbar {
    > button {
      margin-top: 2px;
      margin-bottom: 2px;
    }
  }

  .primary-toolbar {
    padding-top: 0;
    padding-bottom: 0;
    border: none;
    color: $header_fg;
    box-shadow: inset 0 -1px $borders_color;
    background-color: $header_bg;
    background-image: $menubar_bg_image;
    box-shadow: inset 0 -1px $borders_color;

    button {
      @extend %headerbar_buttons;
      min-width: 22px;
      padding-top: 0;
      padding-bottom: 0;
      margin-top: 6px;
      margin-bottom: 6px;
    }

    entry {
      @extend %headerbar_entrys;
      margin-top: if($variant=='light', 2px, 1px);
      margin-bottom: if($variant=='light', 2px, 1px);
      margin-left: 0;
      margin-right: 0;
      padding: 2px 10px;
    }

    .linked.raised > button {
      @extend %linked_header;
      @extend %outline_dashed;
      min-height: 0;
      border-right: 1px solid $borders_color;

      @if $variant == 'light' {
        &:not(:first-child) {
          &:active { box-shadow: -1px 0 mix(black, $header_button_active_bg, 15%); }
          &:checked { box-shadow: -1px 0 mix(black, $header_button_checked_bg, 15%); }
        }
      }

      &, &:hover, &:active, &:checked, &:disabled {
        margin-right: if($variant=='light', 0, 0);

        @if $variant=='dark' {
          &:last-child {
            border-right: none;
          }
        }
      }
    }

    // Pathbar
    .linked.path-bar {
      > button, > button.image-button {
        min-height: 0;
        min-width: 20px;
        padding-top: 0;
        padding-bottom: 0;
        @extend %outline_dashed;
        border-right: 1px solid $borders_color;

        &, &:hover, &:active, &:checked, &:disabled {
          @extend %linked_header;
        }

        @if $variant == 'light' {
          &:not(:first-child) {
            &:active { box-shadow: -1px 0 mix(black, $header_button_active_bg, 15%); }
            &:checked { box-shadow: -1px 0 mix(black, $header_button_checked_bg, 15%); }
          }
        }

        @if $variant=='dark' {
          &:last-child {
            border-right: none;
          }
        }
      }
    }
  }

  // Floating Bar
  .floating-bar {
    padding: 2px;
    background-color: $selected_bg_color;
    color: $selected_fg_color;
    border-radius: 0;
    border: none;

    &.bottom.left {
      border-top-right-radius: $bt_radius;
    }

    &.bottom.right {
      border-top-left-radius: $bt_radius;
    }

    button {
      border: none;
      border-radius: 3px;
      min-height: 16px;
      min-width: 16px;
      -gtk-icon-shadow: none;
      @extend %undecorated_button;
      @extend %selected-button;
    }
  }
}

// Cinnamon setting
.view.cs-category-view {
  border-bottom-right-radius: $wm_radius;
}


//
// Gedit
//
.open-document-selector-treeview.view {
  padding: 3px 6px 3px 6px;
  border-color: $base_color; // disable borders, making them transparent doesn't work for some reason
  &:hover {
    background-color: mix($fg_color, $base_color, 7%);

    &:selected {
      color: $selected_fg_color;
      background-color: $selected_bg_color;
    }
  }
}

.open-document-selector-name-label {
  color: $fg_color;
}

.open-document-selector-path-label {
  color: mix($fg_color, $base_color, 50%);
  font-size: smaller;

  &:selected {
    color: transparentize($selected_fg_color, 0.1);
  }
}

.gedit-document-panel { // 'documents' pane

  row.activatable { padding: 6px 0; }

  row button { // 'close' button
    min-width: 22px;
    min-height: 22px;
    padding: 0;
    margin: 0 6px;
    border-radius: 100px;
    -gtk-outline-radius: 100px;

    image {
      color: inherit;
    }
  }

  row:hover:not(:selected) button {
    color: mix($bg_color, $fg_color, 35%);

    &:hover {
      color: lighten(red, 15%);
    }
    &:active {
      color: $fg_color;
    }
  }

  row:hover:selected button:hover {
    color: lighten(red, 20%);

    &:active {
      color: $selected_fg_color;
    }
  }
}

.gedit-document-panel-dragged-row {
  border: 1px solid $borders_color;
  background-color: darken($bg_color, 10%);
  color: $fg_color;
}

.gedit-side-panel-paned statusbar {
  border-top: 1px solid $borders_color;
  background-color: $bg_color;
  border-radius: 0 0 $wm_radius $wm_radius;
}

.gedit-search-slider {
  background-color: lighten($bg_color, 2%);
  padding: 6px;
  border-color: $borders_color;
  border-radius: 0 0 $bt_radius $bt_radius;
  border-width: 0 1px 1px 1px;
  border-style: solid;
}

.gedit-search-entry-occurrences-tag {
  color: transparentize($fg_color, 0.4);
  border: none;
  margin: 2px;
  padding: 2px;
}

.gedit-map-frame {
  border {
    @if $variant=='light' {
      border-color: transparentize(black, 0.7);
    }
    border-width: 0;

    &:dir(ltr) {
      border-left-width: 1px;
    }
    &:dir(rtl) {
      border-right-width: 1px;
    }
  }
}

.gedit-side-panel-paned.horizontal {
  // 'file-browser' pane
  > box.vertical > stack > grid.horizontal {
    > box.horizontal {  // header-part
      margin: 4px 0;
    }
    > scrolledwindow { // raised widget
      margin: 0 6px 6px 6px;
      border-radius: 0;
      box-shadow: $shadow_5;
    }
  }

  // 'files' pane
  stack {
    scrolledwindow {
      viewport.frame {
        list.gedit-document-panel {
          background: none;
        }
      }
    }
  }
}

paned.titlebar.horizontal {
  headerbar {
    box-shadow: inset 0 1px $highlight_color;

    button.flat.toggle.popup:not(.image-button) { // left-pane header button
      @extend %headerbar_buttons;

      box > .title {
        padding: 0; // remove lateral padding
        margin: -2px 0;
      }
    }
  }
}


//
// Pluma
//
.pluma-window statusbar frame > border {
    border: none;
}

.pluma-window notebook > stack scrolledwindow {
    border-width: 0 0 1px 0;
}

#pluma-status-combo-button {
    min-height: 0;
    padding: 0;

    border-top: none;
    border-bottom: none;
    border-radius: 0;
}

//
// Gnome Builder
//
// TODO: Merge this with the upstream stylesheet
.gb-search-entry-occurrences-tag {
  background: none;
}

workbench.csd > stack.titlebar:not(headerbar) {
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;

  headerbar {
    &,
    &:first-child,
    &:last-child {
      border-radius: $wm_radius $wm_radius 0 0;
    }
  }
}

editortweak .linked > entry.search:focus + .gb-linked-scroller {
  border-top-color: $selected_bg_color;
}

layouttab {
  background-color: $base_color;
}

layout {
  border: 1px solid $borders_color;
  -PnlDockBin-handle-size: 1;
}

eggsearchbar box.search-bar {
  border-bottom: 1px solid $borders_color;
}

pillbox {
  color: $selected_fg_color;
  background-color: $selected_bg_color;
  border-radius: 3px;

  &:disabled label {
    color: transparentize($selected_fg_color, 0.5)
  }
}

docktabstrip {
  padding: 0 6px;

  background-color: $bg_color;
  border-bottom: 1px solid $borders_color;

  docktab {
    min-height: 28px;
    border: solid transparent;
    border-width: 0 1px;

    label {
      opacity: 0.5;
    }

    &:checked,
    &:hover {
      label {
        opacity: 1;
      }
    }

    &:checked {
      border-color: $borders_color;
      background-color: $base_color;
    }
  }
}

dockbin {
  border: 1px solid $borders_color;
  -PnlDockBin-handle-size: 1;
}

dockpaned {
  border: 1px solid $borders_color;
}

dockoverlayedge {
  background-color: $bg_color;

  docktabstrip {
    padding: 0;
    border: none;
  }

  &.left-edge tab:checked,
  &.right-edge tab:checked {
    border-width: 1px 0;
  }
}

popover.messagepopover {
  &.background {
    padding: 0;
  }

  .popover-content-area {
    margin: 16px;
  }
  .popover-action-area {
    margin: 8px;

    button:not(:first-child):not(:last-child) {
      margin: 0 4px;
    }
  }
}

popover.popover-selector {
  padding: 0;

  list {
    row {
      padding: 5px 0;
    }

    row image {
      margin-left: 3px;
      margin-right: 10px;
    }
  }
}

entry.search.preferences-search {
  border: none;
  border-right: 1px solid $borders_color;
  border-bottom: 1px solid $borders_color;
  border-radius: 0;
}

preferences stacksidebar.sidebar {
  list {
    background-image: _solid($base_color);
  }

  list separator {
    background-color: transparent;
  }
}

devhelppanel entry:focus,
symboltreepanel entry:focus {
  border-color: $borders_color
}

button.run-arrow-button {
  min-width: 12px;
}

omnibar.linked > entry:not(:only-child) {
  margin-left: 1px;
  margin-right: 1px;
  @include entry(header-normal);
  border-left: none;

  &:backdrop {
    @include entry(header-normal);
    // background-image: none;

    opacity: 0.65;
  }
}

entry.search.preferences-search { // preferences-search
  box-shadow: none;

  &:focus {
    box-shadow: none;
    border-bottom: 1px solid $selected_bg_color;
  }
}

preferencesbin {
  spinbutton {
    border-radius: $wm_radius;
    border: 1px solid $borders_color;
    background-color: $bg_color;

    &:focus { border-color: $selected_bg_color; }

    entry,
    entry:focus { border: none; box-shadow: none; }

    button {
      border-width: 0 0 0 1px;

      // &:first-child {
      //   border-left: 1px solid $borders_color;
      // }
    }
  }

  entry.search { margin: 2px; }
}

gstyleslidein {
  #scale_box,
  #strings_controls,
  #palette_controls,
  #components_controls {
    button.toggle:checked {
      color: $fg_color;
    }
  }
}

configurationview {
  entry.flat {
    background: none;
  }

  list {
    border-width: 0;
  }
}

window.org-gnome-Builder.workspace > popover.dzlmenubutton {
  > box.vertical > dzlmenubuttonsection.vertical {
    > box.vertical > button.dzlmenubuttonitem {
      color: $alt_fg_color;

      &:active, &:checked {
        color: $fg_color;
        background-color: rgba($fg_color, 0.25);
      }

      > box.horizontal > box.horizontal {
        > label.title {
          color: $fg_color;
        }
      }
    }
  }
}

window.org-gnome-Builder.workspace > stack#titlebar_container.titlebar {
  > headerbar > omnibar {
    > .linked > entry {
      min-height: 0;

      > overlay > box.horizontal > box.vertical.pan {
        > button {
          min-height: 0;
        }
      }
    }
  }
}

//
//  Gnome-Logs
//
window.background > box.vertical box.horizontal {
  list.categories { border-radius: 0 0 0 $wm_radius; } // side-pane
    > box.vertical > scrolledwindow > viewport.frame > list {
      row.event.activatable { // > 3.25.90
        color: $fg_color;
        transition-duration: 0.1s;
        &:hover, &:active { color: $fg_color; }

        label.compressed-entries-label {
          // hard-coded background-color?
          background-image: image($suggested_color);
          color: $selected_fg_color;
          font-weight: 700;
        }

        &.compressed-row {
          background-image: image(darken($bg_color, 3%));
          color: darken($fg_color, 20%);
          transition-property: opacity, // exclude background-color
          border-image,
          background-image,
          box-shadow;
          &:hover {
            background-image: image(mix($fg_color, $bg_color, 5%));
            color: $fg_color;
          }
          &:active {
            &, &:focus {
              background-image: image(mix($fg_color, $bg_color, 10%));
              color: $fg_color;
              animation: none;
            }
          }

          &.popover-activated-row {
            background-image: image($selected_bg_color);
            color: $selected_fg_color;
          }

          &-header {
            background-image: image($base_color); // stop highlighting
            color: $selected_bg_color;
            &:hover {
              background-image: image(mix($selected_bg_color, $base_color, 5%));
            }
            &:active {
              &, &:focus {
                background-image: image(mix($selected_bg_color, $base_color, 10%));
                color: $selected_bg_color;
                animation: none;
                }
              }

              label.compressed-entries-label {
                background-image: image($selected_bg_color);
                color: $selected_fg_color;
                transition-duration: 0s;
              }
           }
        }
     }
  }
}

//
// Gnome-Usage
//

// FIXME: why was 'adwaita.css' used for all user-themes? :/
widget {
  &#PROCESSOR,
  &#MEMORY {
    list {
      row {
        margin: -1px; // kill ugly parent borders
        border: 1px solid $solid_borders_color;

        &.max {
          color: $osd_bg_color; // enforce dark foreground
          // FIXME: we can't override the salmon-pinky background
          // background-image: image($destructive_color);
          // border: 1px solid $destructive_color;
        }
      }

      // kill ugly separators
      separator.list {
        box-shadow: inset 0 0 0 1px $solid_borders_color;
      }
    }
  }

  &#STORAGE {
    list {
      margin: -1px; // kill ugly borders

      row.activatable {
        color: rgba($fg_color, 0.75);
        &:hover,
        &:active { color: rgba($fg_color, 0.75); }
      }

      // kill ugly separators
      separator.list {
        box-shadow: inset 0 0 0 1px $solid_borders_color;
      }
    }
  }

  &#PERFORMANCE {
    searchbar {
      box-shadow: inset 0 -2px $borders_color, inset 0 -1px $bg_color;  // Removed double borders under headerbar
      entry, button { margin-bottom: 2px; }
    }

    .sidebar {
      background-color: $base_color;
      border-bottom-left-radius: $wm_radius;
    }
  }
}

graph-switcher-button.toggle {
  color: rgba($fg_color, 0.75);
  font-weight: 500;
  &:hover { // use opaque
    color: $fg_color;
    background-image: image(if($variant == 'light', rgba(black, 0.05), rgba(white, 0.03)));
  }
}

rg-graph.big {
  // FIXME: We need to re-define these properties to prevent weird
  // 'non-repeated' imaging behind the main graph.
  background-position: left top;
  background-origin: border-box;
  background-repeat: repeat;
}

box.speedometer {
  // FIXME: 'outter' meant 'outer'?
  // circular progress should be drawn with our $accent_color though,
  // damned adwaita.css picks @theme_selected_bg_color up.
  &-outter { opacity: 0.8; } // reduce alpha for our troughs

  &-content-area { // cover up meter troughs with selection colour
    box-shadow: 0 0 0 4px rgba($selected_bg_color, 0.2);
  }
}

//
// Gnome Documents
//

.documents-scrolledwin.frame {
  border-width: 0;
}

button.documents-load-more {
  border-width: 1px 0 0;
  border-radius: 0;
}

.documents-icon-bg {
  background-color: $selected_bg_color;
  color: $selected_fg_color;
  border-radius: 2px;
}

%documents-collection-icon,
.documents-collection-icon {
  background-color: transparentize($fg_color, 0.7);
  border-radius: 2px;
}

button.documents-favorite:active,
button.documents-favorite:active:hover {
  color: lighten($selected_bg_color, 20%);
}

%documents-entry-tag,
.documents-entry-tag {
  color: $selected_fg_color;
  background: $selected_bg_color;
  border-radius: 3px;
  border-width: 0;
  margin: 2px;
  padding: 4px;

  &:hover {
    color: $selected_fg_color;
    background: lighten($selected_bg_color, 4%);
  }
  &:active {
    color: $selected_fg_color;
    background: darken($selected_bg_color, 4%);
  }
  &.button {
    box-shadow: none;
    border: none;
    background-color: transparent;
  }
}

.content-view.document-page {
  border-style: solid;
  border-width: 3px 3px 6px 4px;
  border-image: url("assets/thumbnail-frame.png") 3 3 6 4;
}

//
// Gnome Photos
//
.photos-entry-tag {
  @extend %documents-entry-tag;
}

.photos-collection-icon {
  @extend %documents-collection-icon;
}

.photos-fade-in {
  opacity: 1.0;
  transition: opacity 0.2s ease-out;
}

.photos-fade-out {
  opacity: 0.0;
  transition: opacity 0.2s ease-out;
}

//
// Gnome Tweak Tool ( Gnome tweaks )
//
row#Focus,
row#ClickMethod,
row#StaticWorkspaceTweak, // for 3.26.0
row#dynamic-workspaces,
row#PrimaryWorkspaceTweak, // for 3.26.0
row#workspaces-only-on-primary {
  padding: 0;
  border: 1px solid $borders_color;

  row:not(:last-child) { border-bottom: 1px solid $borders_color; }

  &.tweak > list {
    margin-top: -3px;
  }
}

// Add more spaces between title and list
row#Focus,
row#ClickMethod,
row#PrimaryWorkspaceTweak, // for 3.26.0
row#workspaces-only-on-primary { margin-top: 4px; }

row#AutostartTitle.tweak {
  padding: 3px;
  background-color: $base_color;
}

list#AutostartListBoxTweakGroup {
  &.tweak-group-startup {
    border: 1px solid $borders_color;
  }
}

.tweak-categories,
.tweak-category:not(:selected):not(:hover) {
  background-image: _solid($base_color);
}

// sidebar on gnome tweak
.tweak-categories {
  border-radius: 0 0 0 $wm_radius;

  > separator {
    min-width: 0;
    min-height: 0;
    background: none;
  }
}

.tweak-titlebar-right,
dialog.csd > headerbar.titlebar { > switch { margin: 8px 0; } }

//
//  Gnome Control Center
//
window.background.csd {
  > headerbar.titlebar > box.horizontal > separator.sidebar, // > 3.22
  > headerbar.titlebar > hdyleaflet > separator.sidebar {
    border-right: none;
    background: none;
    min-width: 0;
    border-bottom: 1px solid $header_border;
  }

  > stack {
    border-radius: 0 0 $wm_radius $wm_radius;
  }

  > box:not(.titlebar).horizontal > separator.vertical {
    background-color: if($variant=='light', $borders_color, $header_border);
  }

  > hdyleaflet > stack.background, // > 3.34.0
  > box.horizontal > stack.background {
    background: none;

    > widget {
      > box.horizontal > box.horizontal > box.vertical {
        > button { // wallpaper set button
          &:active {
            color: $fg_color;
            background-image: none;
            background-color: if($variant=='light', darken($button_bg, 15%), lighten($button_bg, 10%));
            border-color: $dark_borders_color;
          }
        }
      }

      > box.vertical > box.vertical { // Gnome 3.34 Wallpaper setting
        > scrolledwindow > viewport.frame {
          background-color: $base_color;
          border-bottom-right-radius: $wm_radius + 1px;

          > box.vertical {
            background: none;
          }
        }
      }

      > scrolledwindow > viewport > hdycolumn {
        frame > list > row {
          .row-header > button:not(.text-button) {
            min-height: 28px;
            min-width: 28px;
            padding: 0;
            margin: 4px 0;
          }
        }
      }
    }
  }

  > hdyleaflet > box.vertical > scrolledwindow.view, // > 3.34.0
  > box.horizontal > box.vertical > scrolledwindow.view { // > 3.25.90
    background-color: $base_color;
    border-bottom-left-radius: $wm_radius + 1px;

    > viewport.frame > stack {
      background-color: transparent;

      list { // left-pane
        background-color: transparent;

        row.activatable:not(:hover):not(:active):not(:selected) {
          background-color: transparent;
        }
      }
    }
  }

  > hdyleaflet > separator.sidebar {
    background: none;
    min-width: 0;
    border-right-color: if($variant=='light', $borders_color, $header_border);
  }
}

box.horizontal > separator.sidebar,
hdyleaflet > separator.sidebar { // reset
  background: none;
  min-width: 0;
  border-right-color: if($variant=='light', $borders_color, $header_border);
}

dialog.background.csd { // wallpaper set dialog
  > headerbar.titlebar {
    > label:not(.title):not(.subtitle) {
      font-weight: 700;
    }
  }

  > box.vertical.dialog-vbox { // wifi setting
    > notebook > stack > box.horizontal > notebook > stack {
      border-radius: 0 0 $wm_radius $wm_radius;
    }
  }
}

//
//  Gnome system monitor
//
window#gnome-system-monitor.background.csd {
  > box.vertical > stack {
    background-color: $base_color;
    border-radius: 0 0 $wm_radius $wm_radius;

    > box.vertical > scrolledwindow {
      treeview.view:not(:hover):not(:selected):not(.progressbar):not(.trough) {
        background: none;
      }
    }
  }
}

//
// gnome-sound-recorder
//
stack {
  > grid.vertical {
    > scrolledwindow {
      border: none;
      border-radius: 0 0 $wm_radius $wm_radius;

      > viewport.frame {
        list {
          border-radius: 0 0 $wm_radius $wm_radius;
        }
      }
    }

    scrolledwindow.frame.emptyGrid { border: none; } // Removed ugly borders
  }
}

//
// Gnome Contacts
//
window.background.csd {
  > overlay > grid.horizontal {
    > frame:dir(ltr) > border { // Removed ugly borders
      border-top-width: 0;
      border-left-width: 0;
      border-bottom-width: 0;
    }

    > overlay > stack > box.horizontal > grid.horizontal {
      > scrolledwindow.contacts-contact-form {
        border-bottom-right-radius: $wm_radius + 1px;
      }
    }
  }
}

//
// Polari
//
stack.view.polari-entry-area {
  background-color: $bg_color;
  border-top: 1px solid $borders_color;

  button.popup.flat.toggle.polari-nick-button {
    &:hover {
      background-color: rgba($fg_color, 0.15);
      box-shadow: none;
      background-image: none;
    }

    &:active, &:checked {
      background-color: rgba($fg_color, 0.25);
      box-shadow: none;
      background-image: none;
    }
  }
}

stack:disabled.view.polari-entry-area { background-image: image($bg_color); }

//
// Transmission
//
.tr-workarea undershoot,
.tr-workarea overshoot {
  border-color: transparent; // Remove black border on over- and undershoot
}

//
// Atril (MATE pdf viewer)
//
.atril-window .primary-toolbar toolbar {
  background: none;
}

//
// Gnome Flashback
//
#gf-bubble,
#gf-osd-window,
#gf-input-source-popup,
#gf-candidate-popup {
  &, &.solid {
    color: lighten($osd_fg_color, 7%);
    background-color: $osd_bg_color;
    border: 1px solid darken($osd_bg_color, 8%);
    border-radius: 2px;
  }

  levelbar {
    block {
      &.low, &.high, &.full {
        background-color: $selected_bg_color;
        border-color: $selected_bg_color;
      }

      &.empty { background-color: darken($osd_bg_color, 5%); }
    }

    trough { background: none; }
  } // FIXME still needs button styling
}

#gf-input-source {
  min-height: 32px;
  min-width: 40px;

  &:selected {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
    border-radius: 2px;
  }
}

gf-candidate-box {
  label {
    padding: 3px;
  }

  &:hover,
  &:selected {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
    border-radius: 2px;
  }
}

 /*************
  * rhythmbox *
  *************/

// add top-border to inline-toolbar
.sidebar-paned .inline-toolbar.horizontal.sidebar-toolbar {
  box-shadow: inset 0 1px $borders_color;
  padding: 4px;
  background-color: darken($bg_color, 3%);

  button.image-button {
//    min-width: 24px;
//    min-width: 24px;
//    padding: 2px;
    @if $variant == 'dark' { border: none; }
    &:active, &:checked { @include button(flat-active); border-color: $borders_color; }

    > widget > box > image { padding: 0; }
  }
}

// tweak sidebar styling
.sidebar-paned {
  scrolledwindow { border: none; }

  // treeview.view.sidebar { }
}

// tweak border and frame in alt-toolbar
window.csd > box.vertical > box.vertical,
window.solid-csd > box.vertical > box.vertical {
  > toolbar.horizontal {
    margin: -1px 0;
    border-top: 1px solid $borders_color;
    border-bottom: none;
    box-shadow: none;
    background-color: transparent;

    > toolitem > .linked > button,
    > toolitem > box.horizontal > button {
      min-height: 36px;
      min-width: 36px;
      padding: 0;
      margin-top: 8px;
      margin-bottom: 8px;
      @if $variant == 'dark' { border: none; }
      // &:hover { @include button(flat-hover); }
      &:active, &:checked { @include button(flat-active); border-color: $borders_color; }
    }
  }

  > frame {
    margin: -1px 0;
    padding: 0;

    > border { border: none; }
  }
}

// hard-coded spacing depends on non-scalable unit,
// seems cover-art widget is the most biggest thing?
window.background > box.vertical > toolbar.primary-toolbar {
  > toolitem {
    > .linked > button.image-button.raised { // 'shuffle/repeat'
      min-height: 36px;
      min-width: 36px;
      padding: 0;
      margin: 0;
      @if $variant == 'dark' { border: none; }
      // &:hover { @include button(flat-hover); }
      &:active, &:checked { @include button(flat-active); border-color: $borders_color; }
      > widget > box > image { padding: 0; }
    }

    button.flat.scale { // 'volume'
      min-height: 24px;
      min-width: 36px;
      padding: 0;
      margin-top: 8px;
      margin-bottom: 8px;
    }

    > box.horizontal:not(.linked) > button.toggle,
    > .linked > button:not(.toggle):not(.raised):not(.flat) {
      min-height: 28px;
      min-width: 28px;
      padding: 0;
      margin: 0;
      @if $variant == 'dark' { border: none; }
      // &:hover { @include button(flat-hover); }
      &:active, &:checked { @include button(flat-active); border-color: $borders_color; }
    }
  }
}

 /********************
  * Gnome Calculator *
  ********************/
window.background {
  > headerbar.titlebar { // mode-selector button
    > button.flat.popup.toggle.text-button.title {
      // .title class existed
      margin: 6px 0; // set standard margins

      > grid > widget { // down arrow
        padding-top: 3px;
        // add spacing between arrow and label
        &:dir(ltr) { padding-left: 4px; }
        &:dir(rtl) { padding-right: 4px; }
      }
    }
  }

  > grid.vertical > box.vertical > widget,
  > grid.vertical > box.vertical > box.vertical > widget,
  > grid.vertical > box.vertical grid.math-buttons {
    button {
      font-weight: 700;

      &:not(.suggested-action) {
        &:active { @include button(flat-active); border-color: $borders_color; }
        &:checked { @include button(flat-checked); border-color: $borders_color; }
      }

      &.suggested-action {  // '=' button
      }
    }
  }
}

/************
 * Epiphany *
 ************/

$question_bg_color: #FFEA00;

// incognito-mode styling
//
// most of widget styling are hard-coded by ephy's stylesheet,
// but we should force using dark foregrounds at least...

headerbar.titlebar.incognito-mode {
  entry {
    @include entry(header-normal);

    &:focus { @include entry(header-focus); }
    &:disabled { @include entry(header-insensitive); }
  }
}

// reset inverted foreground colour
notebook > box > stack > box.vertical > paned.vertical > overlay {
  > .floating-bar { color: rgba($fg_color, 0.75); }
}

.background:not(.csd) > box.vertical > headerbar {
  // conflicts with .primary-toolbar styling?
  .linked > button.image-button { // = 'back/forward' button

  }
}

// overrides foregrounds for 3.24's ssd-mode
.background headerbar entry {
  &.starred,
  &.non-starred {
    @include entry(header-normal);

    &:focus { @include entry(header-focus); }
    &:disabled { @include entry(header-insensitive); }
  }

  // render yellow 'star' icon if bookmarked
  &.starred > image.right {
    color: darken($question_bg_color, 10%);
    &:hover,
    &:active,
    &:checked { color: $question_bg_color; }
  }
}

// popover for downloaded lists
popover.background:not(.emoji-picker) > box.vertical {
  // For clean button
  button:not(.destructive-action):not(.suggested-action):only-child {
    &:active, &:checked { @include button(flat-active); }
  }
}

popover.background:not(.emoji-picker) > box.vertical > scrolledwindow {
  // re-define background colours for GtkListBox
  > viewport.frame > list.background {
    background-color: transparent;

    > row.activatable {
      background-color: if($variant=='light', $bg_color, lighten($bg_color, 10%));
      color: rgba($fg_color, 0.85);
      border-radius: $bt_radius;
      border: 1px solid $borders_color;
      margin: 2px;
      @if $variant=='light' { box-shadow: $shadow_3, inset 0 0 0 1px rgba($borders_color, 0.01); }

      &:hover { @include button(hover); }
      &:active, &:checked { @include button(flat-active); }
    }
  }
}

// popover for bookmarks
popover.background:not(.emoji-picker) > box.vertical > stack > box.vertical {

  scrolledwindow > viewport.frame {
    border: 1px solid $borders_color;

    > list.background > row.activatable.bookmarks-row {
      background-color: rgba($base_color, 0.35);
      color: rgba($fg_color, 0.85);
      border-bottom: 1px dashed rgba($borders_color, 0.05);
      padding: 6px;

      &:hover,
      &:active,
      &:checked { color: $fg_color; background-color: rgba($fg_color, 0.05); }

      button.flat {
        min-width: 16px;
        min-height: 16px;
        padding: 4px; // Same as of image.sidebar-icon
        // margin: 0 4px;
        border-radius: 100px;
        -gtk-outline-radius: 100px;
      }
    }
  }
}

// bookmark-tag flowbox-childs (almost hard-coded)
flowboxchild.bookmark-tag-widget {
  color: $bg_color; // unchecked
  font-weight: 500;

  label { margin-bottom: 2px; }

  &-selected { color: $selected_fg_color; } // checked
}

//
// documents-scrolledwi (Totem, Documents, EvView)
//
.documents-scrolledwin {
  background-color: transparent;

  .content-view {
    background-color: transparent;
    border-radius: 0 0 $wm_radius $wm_radius;
  }

  viewport.frame { // Documents
    background-color: transparent;

    widget > frame.content-view {
      border { border: none; }

      background-color: transparent;
      border-radius: 0 0 $wm_radius $wm_radius;
    }
  }
}

//
// Document Viewer
//
window.background.csd {
  > box.vertical {
    > scrolledwindow {
      > iconview.view.content-view:not(:hover):not(:selected) {
        background-color: transparent;
        border-radius: $wm_radius;
      }
    }
  }

  evview.view.content-view {
    background-color: transparent;
    border-radius: 0 0 $wm_radius $wm_radius;
  }
}

//
// Archive Manager
//
.background.csd {
  > grid.horizontal > paned.horizontal {
    > scrolledwindow {
      border-radius: 0 0 $wm_radius $wm_radius;
      background-color: $base_color;

      treeview.view:not(:hover):not(:selected) {
        background-color: transparent;
      }
    }

    > box.vertical {
      > scrolledwindow {
        border-radius: 0 0 0 $wm_radius;
        background-color: $bg_color;

        treeview.view:not(:hover):not(:selected) {
          background-color: transparent;
        }
      }
    }
  }
}

//
// Eye of GNOME Image Viewer
//
box.vertical > box.vertical > box.vertical{
  > paned.horizontal {
    background-image: none;
    background-color: $header_border;
  }
}

//
// Gnome-Disk
//
window.background.csd {
  > box.vertical > paned.horizontal {
    > scrolledwindow {
      treeview.view {
        border-bottom-left-radius: $wm_radius;
      }
    }
  }
}

//
// Dialogs
//
dialog.background.csd {
  > box.vertical.dialog-vbox {
    > grid.horizontal {
      > scrolledwindow.frame { //removed ugly boders for nautilus batch renaming dialog
        border: none;

        > viewport.frame {
          border: none;

          list:first-child { border-radius: 0 0 0 $wm_radius; }
          list:last-child { border-radius: 0 0 $wm_radius 0; }
        }
      }

      > stack {
        > scrolledwindow.frame { // reset border for totem setting dialog
          border: 1px solid $borders_color;
        }
      }
    }

    > stack,
    > stack > stack {
      > scrolledwindow {
        border-radius: 0 0 $wm_radius $wm_radius;
        background-color: $base_color;

        iconview.view:not(:hover):not(:selected):not(:active) { // Wallpaper setting window
          // @extend %view;
          background-color: transparent;
        }
      }
    }

    > stack {
      // entry { margin: 2px; }
      //
      // spinbutton entry,
      // .linked entry { margin: 0; }

      > scrolledwindow > viewport.frame {
        > list {
          border-radius: 0 0 $wm_radius $wm_radius;

          row.activatable:not(:hover):not(:selected):not(:active) {
            background-color: transparent;
          }
        }
      }

      > box.vertical > stack.view {
        > scrolledwindow > treeview.view:not(:hover):not(:selected):not(:active) {
          background-color: transparent;
        }
      }

      toolbar.toolbar {
        border-radius: 0 0 $wm_radius $wm_radius;
        border-width: 1px 0 0 0;
      }
    }

    > notebook {
      > stack {
        border-radius: 0 0 $wm_radius $wm_radius;
      }
    }

    separator.vertical { background-color: $borders_color; }
  }

  // entry.search { margin: 2px; }
}

//
// Mate OSD Window
//
MsdOsdWindow.background.osd {
  border-radius: 2px;
  border: 1px solid darken($osd_bg_color, 8%);

  .progressbar {
    background-color: $selected_bg_color;
    border: none;
    border-color: red;
    border-radius: 5px;
  }
  .trough {
    background-color: darken($osd_bg_color, 5%);
    border: none;
    border-radius: 5px;
  }
}

//
// Mate/Gnome Flashback Panel
//
.mate-panel-menu-bar,
panel-toplevel.background {
  &, menubar {
    background-color: opacify($panel_bg, 1);
  }

  menubar,
  #PanelApplet label,
  #PanelApplet image {
    color: $panel_fg;
  }

  button:not(#tasklist-button) {  // Panel buttons
    @extend %panel_button;
  }

  button,
  #tasklist-button {
    label, image {
      color: inherit;
    }
  }

  .wnck-pager {
    color: mix($panel_fg, black, 50%);
    background-color: darken($panel_bg, 10%);

    &:hover {
      background-color: lighten($panel_bg, 5%);
    }

    &:selected {
      color: lighten($selected_bg_color, 20%);
      background-color: $selected_bg_color;
    }
  }

  na-tray-applet {
    -NaTrayApplet-icon-padding: 0;
    -NaTrayApplet-icon-size: 16px;
  }
}

//
// Caja
//
.caja-desktop {
  @extend %nautilus-desktop-canvas-item;
}

.caja-notebook {
  border-top: 1px solid $borders_color;
}

// .caja-pathbar {
//   button { }
// }

.caja-navigation-window {
  .primary-toolbar {
    background-color: $header_middle;
  }

  .caja-side-pane {
    background-color: transparent;

    .frame {
      border-width: 1px 0 0;
    }
  }

  paned > separator {
    background-image: image($solid_borders_color);
  }
}

.caja-side-pane {

  treeview.view, .view {
    background: none;

    &:hover {
      background-color: rgba($fg_color, 0.1);
    }

    &:active, &:selected {
      background-color: $selected_bg_color;
    }
  }

  textview.view text { background: none; }

  scrollbar {
    background: none;
  }

  // notebook .view > box.vertical {
  //   border-bottom-left-radius: $wm_radius;
  // }
}

.caja-notebook .frame {
  border-width: 0 0 1px;
}

.caja-search-bar {
  entry {
    // margin: 2px 0;

    &:focus {
      box-shadow: none;
    }
  }
}

//
// Xfce4
//
$text_shadow: 0 0 1px rgba(0, 0, 0, 0.26),
              0 1px 2px rgba(0, 0, 0, 0.32),
              0 2px 3px rgba(0, 0, 0, 0.12);

%panel_button {
  color: $panel_fg;
  border-radius: 0;
  border: none;
  background-color: transparent;

  &:hover:not(:active):not(:checked) {
    color: $fg_color;
    box-shadow: inset 0 -2px rgba($selected_bg_color, 0.5);
  }

  &:checked {
    color: $fg_color;
    box-shadow: inset 0 -2px $selected_bg_color;
    background-color: rgba($fg_color, 0.12);
    background-image: none;
    label, image { color: inherit; }
  }

  &:active {
    background-color: rgba($fg_color, 0.18);
    color: $fg_color;
    background-image: none;
    box-shadow: inset 0 -2px $selected_bg_color;
  }
}

.xfce4-panel.panel {
  background-color: $panel_bg;
  text-shadow: none;
  -gtk-icon-shadow: none;
  border: none;

  button, button.flat {
    @extend %panel_button;
  }
}

.XfceHeading {
  border: 0 none transparent;
  background-color: $bg_color;
  color: $fg_color;
}

.xfce4-panel {
  background-color: $panel_bg;
  color: $panel_fg;
  font-weight: 700;
  text-shadow: none;
  -gtk-icon-shadow: none;

  &, // unset borders
  frame > border { border: none; }

  &#XfcePanelWindow { // main panel container >= 4.13.3?
    // FIXME: unneeded 1px borders are reserved by its code itself
    border: none;

    &, &.marching-ants { transition: none; } // unset transitions
  }

  button.flat { @extend %panel_button; }

  button {
    font-weight: 700;
    @extend %panel_button;

    &#launcher-arrow { // launcher applet
      // FIXME: quite weird pseudo-classe transitions, especially :hover
      // state can't be cleared properly ( -> an upstream issue)
      &, + button.toggle {
        &:hover { box-shadow: none; } // hide indicators
      }

      + button.toggle:checked { // 'arrow' toggle button
        color: $selected_bg_color;
        box-shadow: none;
      }
    }

    &#xfce4-notification-plugin {
      padding: 0 1px; // for 4.12.2
    }
  }

  menu {
    font-weight: 400; // for enforcing regular weight
    text-shadow: none;
    -gtk-icon-effect: none;
  }

  menubar.-vala-panel-appmenu-private { // xfce4 appmenu plugin
    > menuitem {
      font-weight: normal;
    }
  }

  widget.tasklist > button.toggle { font-weight: 400; }
}

XfdesktopIconView.view {
  border-radius: 2px;
  background: transparent;
  color: $selected_fg_color;
  text-shadow: $text_shadow;

  &:active, &:checked {
    background-color: $selected_bg_color;
    color: $selected_fg_color;
    text-shadow: none;
  }

  .rubberband { @extend %rubberband; }
}

window#whiskermenu-window {
  background-color: $bg_color;

  // no CSD class even if the sw compositor was enabled.
  > frame > border {
    border-radius: 0;
  }

  scrolledwindow {
    > viewport button.radio {
      padding: 2px 6px;
      margin: 2px;

      &:hover { background-color: if($variant == 'light', rgba(black, 0.12), rgba(white, 0.12)); }

      &:checked, &:active {
        background-color: $selected_bg_color;
        color: $selected_fg_color;

        &:hover { background-image: none; }
      }
    }

    treeview.view {
      &:selected:hover {
        background-color: if($variant == 'light', rgba(black, 0.1), rgba(white, 0.1));
        color: $fg_color;
      }
    }
  }
}

dialog.background {
  > box.vertical > .dialog-vbox {
    > .dialog-action-box {
      > .dialog-action-area {
        padding: 3px 6px 6px;
      }
    }
  }
}

//
//  * Thunar *
//

window.background.csd.thunar {
  > grid.horizontal > paned.horizontal > scrolledwindow.frame.sidebar.shortcuts-pane {
    border-bottom-left-radius: $wm_radius;
    background-color: $dark_sidebar_bg;

    treeview.view:not(:hover):not(:selected) {
      background-color: transparent;
    }
  }
}

window.thunar {
  > grid.horizontal > paned.horizontal {
    > scrolledwindow.frame.sidebar.shortcuts-pane {
      border-top: none;
      background-color: $dark_sidebar_bg;

      treeview.view {
        background-color: $dark_sidebar_bg;

        &:hover { background-color: if($variant == 'light', rgba(black, 0.08), rgba(white, 0.08)); }

        &:selected, &:selected:hover, &:active:hover {
          color: $fg_color;
          background-color: $sidebar_theme_color;
        }
      }
    }

    > separator {
      background-image: if($variant == 'light', image($solid_borders_color), image($header_border));
    }
  }

  toolbar#location-toolbar {
    border-bottom: 1px solid $header_border;

    button.path-bar-button {
      min-height: if($variant == 'light', 24px, 26px);
      border-right: 1px solid $borders_color;

      @if $variant == 'light' {
        &:active, &:checked { box-shadow: -1px 0 darken($header_button_active_bg, 12%); }
      }

      @if $variant=='dark' {
        border-width: 0 1px 0 0;

        &:last-child {
          border-right-width: 0;
        }
      }
    }

    button.flat {
      @include button(normal);
      @include button(header-normal);
      border-width: 1px;
      margin-left: 0;
      margin-right: 0;
      min-height: if($variant == 'light', 24px, 26px);
      background-clip: padding-box;

      @if $variant=='dark' {
        border-width: 0;
      }

      &:hover { @include button(header-hover); }

      &:checked {
        @include button(header-checked);
        background-clip: if($variant=='light', border-box, padding-box);
        &:hover { background-image: none; }
      }

      &:active {
        @include button(header-active);
        background-clip: if($variant=='light', border-box, padding-box);
        &:hover { background-image: none; }
      }

      &:disabled { @include button(header-insensitive); }

      &:disabled:active, &:disabled:checked { @include button(header-insensitive-active); }

      &, &:hover, &:active, &:checked, &:disabled {
        border-radius: 0;
        border-left-style: none;
        border-right-style: solid;

        &:first-child {
          border-top-left-radius: $bt_radius;
          border-bottom-left-radius: $bt_radius;
          border-left-style: solid;
        }

        &:last-child {
          border-top-right-radius: $bt_radius;
          border-bottom-right-radius: $bt_radius;
        }

        &:only-child {
          border-radius: $bt_radius;
          border-style: solid;
        }
      }

      @if $variant == 'light' {
        &:not(:first-child) {
          &:active { box-shadow: -1px 0 mix(black, $header_button_active_bg, 15%); }
          &:checked { box-shadow: -1px 0 mix(black, $header_button_checked_bg, 15%); }
        }
      }

      @if $variant=='dark' {
        &:last-child {
          border-right: none;
        }
      }
    }

    > toolbutton#open-parent > button.image-button.flat:not(.toggle) {
      border-top-right-radius: 0;
      border-bottom-right-radius: 0;
      border-right: none;
      margin-left: 10px;
    }

    > toolbutton#open-home > button.image-button.flat:not(.toggle) {
      border-top-left-radius: 0;
      border-bottom-left-radius: 0;
      margin-right: 10px;

      @if $variant=='dark' {
        border-left: 1px solid $borders_color;
      }
    }

    // > toolitem#back > button.flat.toggle,
    > toolitem#forward > button.flat.toggle {
      @if $variant=='dark' {
        margin-left: 1px;
      }
    }

    // FIXME: need to unset for weird allocation height
    entry {
      // min-height: if($variant == 'light', 19px, 21px);
      margin-top: -2px;
      margin-bottom: -1px;
    }
  }

  notebook {
    // hide unneeded border
    stack > scrolledwindow.frame.standard-view {
      border-top-width: 0;
      border-right-width: 0;
    }

    // an allocation height of label node affects to close button's
    // image height (it's quite weird).
    header.top tab.reorderable-page > box > label { min-height: 0; }
  }
}

dialog.background:not(.csd) {
  > .dialog-vbox > .dialog-action-box {
    > .dialog-action-area {
      margin: 0 6px 6px;
    }
  }
}

 /*********
  * Geary *
  *********/
.geary-main-window.background.csd,
window#GearyMainWindow.background.csd {
  box.vertical > paned.horizontal > box.sidebar.vertical {
    border-bottom-left-radius: $wm_radius;

    statusbar {
      border-bottom-left-radius: $wm_radius;
    }
  }

  stack#conversation_viewer {
    border-bottom-right-radius: $wm_radius;

    scrolledwindow.geary-conversation-scroller {
      viewport.frame {
        list.conversation-listbox {
          background: none;
          border-bottom-right-radius: $wm_radius;
        }
      }
    }
  }
}

//
// * Firefox and Thunderbird *
//

window.background:not(.csd) {
  > widget {
    // for the bookmark toolbar's separators
    > separator {
      padding-top: 1px;
      margin-top: 1px;
      min-height: 2px;
      background-color: $borders_color;
    }

    // avoid black border
    > scrollbar { background-clip: border-box; }

    // emphasize borders color
    > scrollbar,
    > frame > border { border-color: $borders_color; }

    > entry,
    .entry { // Set for linked entrys
      // min-height: 26px;
      border-radius: $bt_radius;
      background-image: image($base_color);
      border: 1px solid $borders_color;

      &:focus { border-color: $selection_mode_bg; box-shadow: inset 0 0 0 2px $entry_highlight; }
    }

    > spinbutton {
      background-image: image($button_bg);
      border: 1px solid $borders_color;

      @if $variant == 'light' {
        &:active {
          background-image: image($bg_color);
        }
      }

      // Fixed thunderbird linked entry spinbutton border-radius.
      .entry { border-top-right-radius: 0;  border-bottom-right-radius: 0; }
    }

    > button {
      padding-top: 3px;
      padding-bottom: 3px;
    }

    > button > button {
      outline-style: none;
      border-radius: $bt_radius;

      @if $variant == 'light' {
        &:active {
          border-radius: $bt_radius;
          border: none;
          background-image: image($bg_color);
          box-shadow: inset 0 0 0 1px $borders_color;
        }
      }

      label { padding: 4px 6px; }
    }
  }

  > menu,
  > menu > menu {
    border-radius: 0;
    background-color: $menu_bg;
  }

  > menu > menuitem {
    padding: 4px 6px;

    > label:disabled { color: $disabled_fg_color; }

    > radio,
    > check {
      padding: 0 2px 0 4px;
    }
  }

  > window > menu {
    menuitem {
      transition: none; // Fixed plank menu background issue
    }
  }
}

// /*******************
//  * Firefox Quantum *
//  *******************/

#MozillaGtkWidget.background {
  // blend with weird toolbar backgrounds
  background-color: $bg_color;

  // FIXME: resetting child elements background is not fully functional yet
  // because WidgetStyleCache keeps holding initial background-color.
  // the stem of this incorrect colouring seems to be caused by their
  // gdk_rgba to ns_rgba conversion. I don't think theme's fault.
  .background,
  frame,
  separator,
  scrolledwindow { background-color: $base_color; }

  scrollbar {
    background-color: transparent;

    slider {
      background-color: mix($fg_color, $bg_color, 45%);
      &:hover { background-color: mix($fg_color, $bg_color, 60%); }
      &:hover:active { background-color: mix($fg_color, $bg_color, 75%); }
      &:disabled { background-color: transparent; }
    }
  }

  *:not(menuitem):hover, // exclude menuitem node
  *:focus,
  *:active,
  *:checked {
    &, button { color: $fg_color; } // enforce opaque foregrounds
  }

  > window.background > menu { // context-menus
    border: none; // hide ugly double borders
    background-color: $menu_bg;
    border-radius: 0;

    // revert to standard separators
    > separator {
      margin-top: 2px;
      margin-bottom: 2px;
      background-color: $borders_color;
    }
  }

  > widget {
    border { border-color: if($variant == 'light', darken($bg_color, 15%), lighten($bg_color, 20%)); }

    separator { background-color: $borders_color; }

    // FIXME: this affected to popover widget as well,
    // so we can not set $lighter_bg_color to search-bar...
    > scrolledwindow > textview {
      background-color: $menu_bg;

      text {
        background-color: transparent;
        color: if($variant =='light', $text_color, #aaaaaa);

        &:selected,
        &:selected:focus,
        selection { @extend %selected_items; }
      }
    }
  }
}

/***************
 * Chrome(ium) *
 ***************/

$chrome_bg_color: $bg_color;
$chrome_fg_color: $text_color;
$chrome_menu_bg_color: $menu_bg;
$chrome_menu_fg_color: $fg_color;

window.background.chromium {
  // checked-tab & toolbar & button widgets
  background-color: $bg_color;
  color: $text_color;

  headerbar.titlebar {
    button.toggle { // account-button (> 64.0.3282?)
      border: none;
      background-color: transparent;
      background-image: none;

      &:hover { @include button(flat-hover); }
      &:checked, &:active { @include button(flat-active); }
    }

    // from nav_button_provider_gtk3.cc (> 62.0.3202?)
    button.titlebutton { // title-buttons
      // define global titlebutton class sizing
      min-width: 16px;
      min-height: 16px;
      margin: 0; // unset margins
      padding: 0 0;
      background-size: auto;
      color: transparent; // hide stock icons
    }
  }

  // FIXME: not for actual button widgets but for toolbar's separators
  // crazy: src/+/master/chrome/browser/ui/libgtkui/gtk_ui.cc#891
  button { // for active-tab borders
    border-width: 1px;
    border-style: solid;
    border-color: $solid_borders_color;
    background-color: $chrome_bg_color;
    color: $chrome_fg_color;
  }

  entry.chromium {
    &, &:focus { // overrides standard borders
      border-image: none;
      border: 1px solid $solid_borders_color;
      background-color: $chrome_bg_color;
      color: $chrome_fg_color;
    }
  }

  // internal region of toolbar's entry widget
  > textview.view, textview {
    background-color: $chrome_bg_color;
    color: $chrome_fg_color;
  }

  > menubar { background-color: $header_bg; }

  // > menu {
  //   border: 1px solid $solid_borders_color;
  //   color: $chrome_menu_fg_color;
  //   background-color: $chrome_menu_bg_color;
  //
  //   > separator, .separator {
  //     margin: 2px 0;
  //     min-height: 0;
  //     border-bottom: 2px solid $menu_bd;
  //     background: none;
  //   }
  //
  //   > menuitem {
  //     color: $chrome_menu_fg_color;
  //
  //     &:hover {
  //       color: $selected_fg_color;
  //       background-color: $selected_bg_color;
  //     }
  //
  //     &:disabled {
  //       color: rgba($chrome_menu_fg_color, 0.45);
  //     }
  //
  //     // label { &:disabled { color: rgba($chrome_menu_fg_color, 0.45); } }
  //
  //     accelerator { color: rgba($chrome_menu_fg_color, 0.45); }
  //   }
  // }
}

/****************
 * Libre-Office *
 ****************/
window.background:not(.solid-csd) {
  // reserved area at the most-right side of GtkMenuBar
  > grid.horizontal > grid.horizontal {
    background-image: $menubar_bg_image;
    background-color: transparent;
    box-shadow: inset 0 -1px $borders_color;

    > button.flat.small-button {
      // 'close' button
      color: $header_fg;
      border: none;
      border-radius: 50px;
      background-image: none;

      &:hover {
        background-color: lighten($header_bg, 15%);
        color: lighten($header_fg, 5%);
      }

      &:active,
      &:checked {
        background-color: rgba(red, 0.65);
        color: white;
      }

      &:disabled {
        color: rgba($header_fg, 0.6);
      }
    }
  }
}

window.background:not(.solid-csd) {
    // for 'Notebookbar' toolbar
  > notebook:not(.frame) {
    border: 0 none transparent; // unset borders
    background-color: $base_color;

    > stack {
      border: none;
      box-shadow: none;
    }
  }
}

// /*********
//  * Tilix *
//  *********/

// in-line titlebars
widget > box.terminal-titlebar {
  padding: 0 6px;

  > button.flat.popup.toggle {
    border: none;
    border-radius: 0;
    padding-top: 0;
    padding-bottom: 0;

    &:dir(ltr) { padding-right: 6px; }
    &:dir(rtl) { padding-left: 6px; }

    &:hover, &:checked, &:active {
      border-radius: 0;
    }

    &:checked, &:active {
      background-color: rgba($fg_color, 0.05);
      color: $fg_color;
    }
  }

  > button.image-button { // 'plus' and 'close'
    &, &.toggle {
      margin: 2px 0;
      padding: 0;
      min-height: 24px;
      min-width: 24px;
      border-radius: $bt_radius;
      -gtk-outline-radius: $bt_radius;
    }
  }
}

list.tilix-session-sidebar {
  // use -image property instead
  background-image: image($dark_sidebar_bg);

  button.tilix-sidebar-close-button {
    min-height: 20px;
    min-width: 20px;
    padding: 0;
    border-radius: 100px;
    -gtk-outline-radius: 100px;
    background-color: $destructive_color;
    &, &:hover, &:active, &:checked { color: white; }

    &:hover { background-color: lighten($destructive_color, 10%); }

    &:active,
    &:checked { background-image: image(darken($destructive_color, 10%)); }
  }
}

window.background.csd {
  > box.horizontal > stack {
    > box.vertical > notebook > stack {
      border-bottom-right-radius: $wm_radius;
    }
  }
}

//
// Pamac
//


// /************
//  * Synaptic *
//  ************/
window > box.vertical > box.horizontal {
  > toolbar {
    background-color: transparent;
    box-shadow: none;

    toolitem > box {
      label,
      entry {
        min-height: 20px;
        padding-top: 2px;
        padding-bottom: 2px;
        font-size: 90%;
      }

      > label { color: $fg_color; }
    }
  }

  > widget { background-color: transparent; }
}

//
// vala-panel
//
window#ValaPanel.background {
  // background-image: linear-gradient(0deg, $panel_bottom_color 0%, $panel_top_color 100%);
  // border: 1px solid $header_border;
  // color: currentColor;

  widget.-vala-panel-background {
    > separator { // separator applet
      background: none;
    }
  }
}

button.flat.-panel-button,
button#tasklist-button.toggle.flat,
// tasklist-arrow-button.toggle.flat.-panel-flat-button, // xfce tasklist button
button.flat.-panel-icon-button {
  // @extend %budgie_icon_tasklist_button;

  &:hover {
    box-shadow: inset 0 -2px rgba($selected_bg_color, 0.5);
    background: none;
  }

  &:active,
  &:checked {
    box-shadow: inset 0 -2px $selected_bg_color;
    color: if($variant == 'light', darken($panel_fg, 5%), $selected_fg_color);
    background: none;
  }
}

.unpinned button.flat.-panel-icon-button {
  border-radius: 0;

  &:hover { -gtk-icon-effect: highlight; }
  &:hover,
  &:active,
  &:checked {
    box-shadow: inset 0 -2px $selected_bg_color;
    color: if($variant == 'light', darken($panel_fg, 5%), $selected_fg_color);
  }
}

.pinned button.flat.-panel-icon-button.running {
  border-radius: 0;

  > image {
    background-position: bottom center;
  }

  &:hover { -gtk-icon-effect: highlight; }
  &:hover,
  &:active,
  &:checked {
    box-shadow: inset 0 -2px $selected_bg_color;
    color: if($variant == 'light', darken($panel_fg, 5%), $selected_fg_color);
  }
}

// vala-panel-appmenu
// menubar.-vala-panel-appmenu-private, // xfce4 appmenu plugin
// menubar.-vala-panel-background {
//   background: none;
//   border: none;
//   box-shadow: none;
//
//   > menuitem {
//     color: $panel_fg;
//     font-weight: normal;
//     &:hover { color: $selected_fg_color; }
//
//     // > window.background.popup > decoration,
//     // > window.background.popup > menu { border-radius: 0 0 $wm_radius $wm_radius; }
//   }
// }

// * Elementary Apps *

//
// Wingpanel
//
.menubar.panel {
  .panel {
    &, &.color-light, &.color-dark {
      background-color: transparent;
      background-image: linear-gradient(0deg, rgba($panel_bottom_color, 0.95) 0%, rgba($panel_top_color, 0.95) 100%);
      border-bottom: 1px solid if($variant == 'light', $panel_border_color, $header_border);
      transition: all 100ms ease-in-out;
      color: $panel_fg;
    }

    &.maximized {
      background-color: $panel_bg;
      background-image: none;
      border: none;
    }

    &.translucent {
      background-color: rgba($panel_bg, 0.75);
      background-image: none;
      border: none;
    }

    menubar {
      background: none;
      box-shadow: none;
      border: none;
    }
  }

  popover {
    padding: 2px 4px;
    margin: 0 6px 15px 6px;
    border: 1px solid if($variant == 'light', rgba(black, 0.35), rgba(black, 0.45));
    box-shadow: 0 3px 5px rgba(black, 0.12), 0 5px 8px rgba(black, 0.08);

    button {
      @include button(undecorated);
      &:hover { @include button(flat-hover); }
      &:active { @include button(flat-active); label { color: white; } }
      &:checked { @include button(flat-checked); label { color: white; } }
      &:disabled { @include button(flat-insensitive); }
      &, &:hover, &:active, &:checked, &:disabled { border-color: transparent; }
    }

    .linked > button {
      @include button(normal);
      &:hover { @include button(hover); }
      &:active, &:checked { @include button(active); }
      &:disabled { @include button(insensitive); }
    }

    list { background-color: transparent; }

    separator.horizontal {
      margin: 0 -4px;
    }

    separator.vertical {
      background: none;
    }

    .sidebar {
      border-style: none;
      background: none;

      .view {
        background: none;

        &:hover {
          border-radius: $bt_radius;
          background-color: if($variant=='light', rgba(black, 0.1), rgba(white, 0.1));
        }

        &:selected {
          &, &:focus, &:backdrop {
            text-shadow: none;
            transition: all 200ms $ease-out-quad;
            background-color: if($variant=='light', rgba(black, 0.65), rgba(white, 0.35));
            border-radius: $bt_radius;
          }
        }
      }
    }
  }
}

.composited-indicator {
  padding: 0 6px;

  > revealer label,
  > revealer image,
  > revealer spinner {
    color: $panel_fg;
    font-weight: normal;
    transition: all 200ms ease-in-out;
    text-shadow: none;
    -gtk-icon-shadow: none;
  }

  > revealer image,
  > revealer spinner {
    padding: 3px 0;
  }

  > revealer label {
    padding: 3px 6px;
  }

  .keyboard {
    background-color: $panel_fg;
    border-radius: 2px;
    color: $panel_bg;
    padding: 0 3px;
    font-weight: normal;
    box-shadow: none;
    text-shadow: none;
  }
}

// Popover switcher dots
button.flat.toggle.switcher {
  &:hover, &:active, &:checked, &:selected {
    image {
      color: $selected_bg_color;
    }
  }
}

// Calendar Popover
.circular { // Calendar popover date button
  label:disabled { color: $disabled_fg_color; }

  &.accent { // Today button
    color: $selected_fg_color;
    background-color: $selected_bg_color;
  }
}

// Marlin / Pantheon Files
MarlinViewWindow {
  *:selected, *:selected:focus {
    color: $selected_fg_color;
    background-color: $selected_bg_color;
    outline-color: transparent;
  }

  GtkIconView.view:selected {
    &, &:focus, &:hover, &:focus:hover { background-color: transparent; }
  }

  FMListView, FMColumnView { outline-color: transparent; }
}

.marlin-pathbar.pathbar {
  padding-left: 4px;
  padding-right: 4px;

  @include entry(header-normal);
  &:focus { @include entry(header-focus) }
  &:disabled { @include entry(header-insensitive) }
}

window.background.csd {
  > paned.horizontal {
    > separator {
      &:dir(ltr) { margin-left: -1px; }
      &:dir(rtl) { margin-right: -1px; }
    }

    > scrolledwindow {
      > viewport.frame {
        > box.vertical treeview.view {

          &:not(:hover):not(:selected) {
            border-bottom-left-radius: $wm_radius;
            background: none;
          }

          color: $dark_sidebar_fg;
          padding-top: 3px;
          padding-bottom: 3px;
          border-right: 1px solid $header_border;
          @extend %view;

          &:not(:selected):hover { background-color: if($variant == 'light', rgba(black, 0.05), rgba(white, 0.05)); }

          image {
            color: $dark_sidebar_fg;
            &:selected { color: $selected_fg_color; }
            &:disabled { color: rgba($dark_sidebar_fg, 0.45); }
          }

          &.trough {
            color: $fg_color;
            background-color: $button_border;
            border-radius: $bt_radius;
            border-width: 0;

            &:selected, &:selected:focus {
              color: $selected_fg_color;
              background-color: transparentize(black, 0.8);
              border-radius: $bt_radius;
              border-width: 0;
            }
          }
        }
      }
    }
  }

  > stack > stack {
    > paned.horizontal {
      > scrolledwindow > viewport.frame {
        list {
          border-bottom-left-radius: $wm_radius;
        }
      }
    }
  }
}

.dynamic-notebook {
  notebook > stack {
    border-bottom-right-radius: $wm_radius;
    background-color: $base_color;

    scrolledwindow.view.h2 {
      background-color: transparent;
    }

    treeview.view,
    iconview.view {
      &:not(:hover):not(:selected) { background: none; }
      &:hover { background-color: if($variant == 'light', rgba(black, 0.05), rgba(white, 0.05)); }
      &:selected {
        color: $fg_color;
        background-color: if($variant == 'light', rgba(black, 0.1), rgba(white, 0.1));
      }
    }
  }
}

headerbar.titlebar {
  > box.horizontal > entry.pathbar {
    min-height: 20px;
    padding: 2px 16px;
    margin-top: 2px;
    margin-bottom: 2px;
  }

  > button.flat.image-button.toggle {
    margin-top: 5px;
    margin-bottom: 5px;

    &:not(:checked):not(:active) {
      background-clip: if($variant=='light', padding-box, padding-box);
    }

    @if $variant == 'light' {
      border-width: 1px;
      border-style: solid;
      border-color: $borders_color;
    }

    @include button(header-normal);
    &:hover { @include button(header-hover); }
    &:active { @include button(header-active); }
    &:checked { @include button(header-checked); }
    &:disabled { color: transparentize($header_fg, 0.4); }
    &:backdrop { opacity: 0.7; background-image: none;}

    + button.flat.image-button.toggle { margin-right: if($variant=='light', -6px, -5px); }
  }

  // Hide Code header format-bar
  > grid.linked.horizontal.format-bar {
    background-image: $headerbar_bg_image;
    margin-top: 6px;
    margin-bottom: 6px;
    border: none;

    button.toggle {
      margin-top: 0;
      margin-bottom: 0;
    }

    &:backdrop {
      transition: $backdrop_transition;
      background-image: none;
      background-color: $header_bg_backdrop;
    }
  }
}

// Gala
.gala-notification {
    border: 1px solid $dark_borders_color;
    border-radius: $wm_radius;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    background-image: _solid($osd_bg_color);
    background-color: transparent;

  .title, .label {
    color: $osd_fg_color;
  }
}

// system setting
actionbar.inline-toolbar {
  border: none;
  border-top: 1px solid $borders_color;

  button { // Reset buttons
    border-radius: $bt_radius;
    // border: 1px solid $dark_borders_color;

    &:first-child {
      border-right-style: solid;
    }

    &:last-child {
      border-left-style: solid;
    }
  }
}

// Nightlight warmth trough
scale.warmth trough {
  min-height: 4px;
  border-radius: 3px;
  background-image: linear-gradient(to right, $suggested_color, $destructive_color);
  box-shadow: inset 0 0 0 1px rgba(black, 0.25);
}

// Terminal
.terminal-window {
  headerbar.titlebar.default-decoration {
    background-image: $headerbar_bg_image;
    background-color: $header_bg;
    border-bottom: 1px solid $header_border;
    box-shadow: inset 0 1px $highlight_color;

    &:backdrop {
      transition: $backdrop_transition;
      color: transparentize($header_fg, 0.3);
      background-image: none;
      background-color: $header_bg_backdrop;
      border-color: if($variant=='light', lighten($header_border, 15%), darken($header_border, 3%));
    }
  }

  .search-bar {
    background-color: $bg_color;
    border-bottom: 1px solid $solid_borders_color;
  }

  .dynamic-notebook {
    notebook > header { border-color: $solid_borders_color; }
  }
}
